@extends('layout.master')
@section('content')
<div class="right_col" role="main">
<div class="">
<div class="page-title">
<div class="title_left w-100">
<h3>Driver Profile</h3>
</div>
</div>
<div class="clearfix"></div>
<div class="row">
<div class="col-md-12 col-sm-12 ">
<div class="x_panel">
<div class="x_title">
<h2>Driver Details
<small>
@if ($driver->status == 'active')
<span class="badge badge-success text-white">Active</span>
@elseif ($driver->status == 'inactive')
<span class="badge badge-secondary text-white">Inactive</span>
@elseif ($driver->status == 'suspended')
<span class="badge badge-warning text-white">Suspended</span>
@endif
</small>
</h2>
<ul class="nav navbar-right panel_toolbox">
<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
</li>
</ul>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="row">
<div class="col-md-3 col-sm-3 profile_left">
<div class="profile_img">
<div id="crop-avatar">
<!-- Current avatar -->
<img class="img-responsive avatar-view"
src="{{ $driver->image ? asset('storage/' . $driver->image) : asset('images/user_logo.png') }}"
alt="Driver Avatar" title="Driver Image"
style="width:150px; height:150px; object-fit:cover;">
</div>
</div>
<h3>
{{ $driver->name }}
@if ($driver->is_verified)
<img src="{{ asset('images/Tick.png') }}" alt="Verified"
style="width:25px; height:20px;">
@endif
</h3>
<ul class="list-unstyled user_data">
<li>
<i class="fa fa-envelope user-profile-icon"></i> <strong>Email:</strong>
{{ $driver->email }}
</li>
<li>
<i class="fa fa-phone user-profile-icon"></i> <strong>Phone:</strong>
{{ $driver->phone }}
</li>
@if ($driver->age)
<li class="m-top-xs">
<i class="fa fa-birthday-cake user-profile-icon"></i>
<strong>Age:</strong>{{ $driver->age }} years
</li>
@endif
@if ($driver->experience)
<li class="m-top-xs">
<i class="fa fa-expeditedssl user-profile-icon"></i>
<strong>Experience:</strong>{{ $driver->experience }} years
</li>
@endif
@if ($driver->transporter)
<li class="m-top-xs">
<i class="fa fa-user user-profile-icon"></i>
<strong>Transporter:</strong><a
href="{{ route('admin.transporter.view', $driver->transporter->id) }}">{{ $driver->transporter->company_name }}</a>
</li>
@endif
</ul>
<div class="justify-content-between">
<a href="{{ route('admin.driver.edit', $driver->id) }}"
class="btn btn-primary btn-sm"><i class="fa fa-edit m-right-xs"></i> Edit
Profile
</a>
@if ($driver->documents->count() > 0)
<button type="button"
class="{{ $driver->is_verified ? 'btn btn-danger' : 'btn btn-success' }} btn-sm verify-driver"
data-id="{{ $driver->id }}"
data-verified="{{ $driver->is_verified ? 1 : 0 }}">
{{ $driver->is_verified ? 'Unverify Driver' : 'Verify Driver' }}
</button>
@endif
</div>
<br />
</div>
<div class="col-md-9 col-sm-9 ">
{{-- <div class="profile_title">
<div class="col-md-6">
<h2>User Activity Report</h2>
</div>
<div class="col-md-6">
<div id="reportrange" class="pull-right"
style="margin-top: 5px; background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #E6E9ED">
<i class="glyphicon glyphicon-calendar fa fa-calendar"></i>
<span>December 30, 2014 - January 28, 2015</span> <b class="caret"></b>
</div>
</div>
</div> --}}
<!-- start of user-activity-graph -->
{{-- <div id="graph_bar" style="width:100%; height:280px;"></div> --}}
<!-- end of user-activity-graph -->
<div class="" role="tabpanel" data-example-id="togglable-tabs">
<ul id="myTab" class="nav nav-tabs bar_tabs" role="tablist">
<li role="presentation" class="active"><a href="#tab_content2" role="tab"
id="profile-tab" data-toggle="tab" aria-expanded="false">Document
Details</a>
</li>
</ul>
<div id="myTabContent" class="tab-content">
<div role="tabpanel" class="tab-pane active table-responsive" id="tab_content2"
aria-labelledby="profile-tab">
<!-- start driver documents -->
<table class="data table table-striped no-margin">
<thead>
<tr>
<th>#</th>
<th>Document Name</th>
<th>Document Number</th>
<th>Status</th>
<th>Action</th>
</tr>
</thead>
<tbody>
@forelse($driver->documents as $index => $document)
<tr>
<td>{{ $index + 1 }}</td>
<td>{{ \App\Models\Document::documentTypes($document->doc_type) }}
</td>
<td>{{ $document->doc_number ?? '-' }}</td>
<td class="vertical-align-mid">
@if ($document->is_verified ?? false)
<span class="badge badge-success">Verified</span>
@else
<span class="badge badge-warning">Pending</span>
@endif
</td>
<td class="vertical-align-mid">
@if ($document->file_url)
<a href="{{ asset('storage/' . $document->file_url) }}"
class="btn btn-primary btn-sm" target="_blank"
title="View file"><i class="fa fa-eye"></i></a>
@endif
@if (!$document->is_verified)
<button type="button"
class="btn btn-success btn-sm verify-doc"
data-id="{{ $document->id }}"
title="Verify Document">
<i class="fa fa-check"></i>
</button>
@endif
<button type="button"
class="btn btn-danger btn-sm delete-doc"
data-id="{{ $document->id }}"
title="Delete Document">
<i class="fa fa-trash"></i>
</button>
</td>
</tr>
@empty
<tr>
<td colspan="5" class="text-center text-muted">No
documents
uploaded</td>
</tr>
@endforelse
</tbody>
</table>
<!-- end driver documents -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@push('script')
<script>
$(document).on('click', '.verify-doc', function() {
let docId = $(this).data('id');
let button = $(this);
Swal.fire({
title: 'Are you sure?',
text: "Mark this document as verified?",
icon: 'question',
showCancelButton: true,
confirmButtonText: 'Yes, verify it!'
}).then((result) => {
if (result.isConfirmed) {
$.ajax({
url: '/admin/driver/document/' + docId + '/verify',
method: 'POST',
data: {
_token: '{{ csrf_token() }}'
},
success: function(res) {
Swal.fire('Verified!', res.message, 'success').then(() => {
location.reload();
});
},
error: function(err) {
Swal.fire('Error', 'Something went wrong', 'error');
}
});
}
});
});
$(document).on('click', '.delete-doc', function() {
let docId = $(this).data('id');
let card = $('#doc-card-' + docId);
Swal.fire({
title: 'Are you sure?',
text: "This document will be permanently deleted!",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#d33',
cancelButtonColor: '#6c757d',
confirmButtonText: 'Yes, delete it!',
cancelButtonText: 'Cancel'
}).then((result) => {
if (result.isConfirmed) {
$.ajax({
url: '/admin/driver/document/delete/' + docId,
type: 'DELETE',
data: {
_token: '{{ csrf_token() }}'
},
success: function(response) {
if (response.success) {
card.remove();
Swal.fire(
'Deleted!',
response.message,
'success'
).then(() => {
location.reload();
});
} else {
Swal.fire(
'Error!',
'Something went wrong.',
'error'
);
}
},
error: function() {
Swal.fire(
'Error!',
'Unable to delete document.',
'error'
);
}
});
}
});
});
$(document).on('click', '.verify-driver', function() {
const $btn = $(this);
const driverId = $btn.data('id');
const isVerified = $btn.data('verified') == 1;
const actionText = isVerified ? 'unverify' : 'verify';
Swal.fire({
title: 'Are you sure?',
text: `Do you want to ${actionText} this driver?`,
icon: 'question',
showCancelButton: true,
confirmButtonText: `Yes, ${actionText} it!`
}).then((result) => {
if (!result.isConfirmed) return;
$.ajax({
url: '/admin/driver/' + driverId + '/verify',
method: 'POST',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
},
data: {
status: isVerified ? 0 : 1
},
success: function(res) {
Swal.fire('Success!', res.message || 'Status updated', 'success');
// Toggle status
$btn.data('verified', isVerified ? 0 : 1);
$btn.text(isVerified ? 'Verify Driver' : 'Unverify Driver');
$btn.toggleClass('btn-success btn-danger');
},
error: function(xhr) {
let msg = 'Something went wrong';
if (xhr.responseJSON && xhr.responseJSON.message) msg = xhr.responseJSON
.message;
Swal.fire('Error', msg, 'error');
}
});
});
});
</script>
@endpush